<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>11</li>
        <li>22</li>
        <li>33</li>
    </ul>
</body>
</html>
<script>
    // set 的创建 方式一
    let set = new Set([1,2,3,4]);
    // set 的创建 方式二
    let set1 =new Set();
    set1.add(1);
    set1.add(2);
    set1.add(3);


    // 判断set是否包含某个值
    let set2 = new Set([1,2,3,4]);
    console.log(set2.has(3));


    // 删除某个值
    let set3 = new Set([1,2,3,4]);
    set3.delete(3);
    console.log(set3);


    // 删除所有值
    let set4 = new Set([1,2,3,4]);
    set4.clear();
    console.log(set4);


    // 获取set的长度
    let set5 = new Set([1,2,3,4]);
    console.log(set5.size);


    // 获取set的值
    var set6 = new Set([1,2,3,4]);
    console.log(set6.keys());
    console.log(set6.values());


    
    // 去重
    var arr = [1,2,3,,1,4,2,3,3];
    var set7 = new Set(arr);
    var newarr = [...set6];
    console.log(newarr);





    // map的创建  方法一
    let map = new Map([["name","sde"],["age",20],["height","178cm"]]);
    // map的创建  方法二
    let map1 = new Map();
    map1.set("name","sde");
    map1.set("age",20);
    map1.set("height","178cm");


    // map.get('键名') 获取键值
    let map2 = new Map([["name","sde"],["age",20],["height","178cm"]]);

    console.log(map.get("age"));


    // 删除某个值
    let map4 = new Map([["name","sde"],["age",20],["height","178cm"]]);
    map4.delete("age");
    console.log(map4);


    // 删除所有
    let map5 = new Map([["name","sde"],["age",20],["height","178cm"]]);
    map5.clear();
    console.log(map5);


    // 获取长度
    let map6 = new Map([["name","sde"],["age",20],["height","178cm"]]);
    console.log(map6.size);
 
    // 获取所有的键名和键值
    let map7 = new Map([["name","sde"],["age",20],["height","178cm"]]);
    console.log(map7.keys());
    console.log(map7.values());


    // 判断是否有某个键名
    let map8 = new Map([["name","sde"],["age",20],["height","178cm"]]);
    console.log(map8.has("name"));



    var lis = document.querySelectorAll("li");
    let map9 = new Map();
    map9.set(lis[0],"red");
    map9.set(lis[1],"yellow");
    map9.set(lis[2],"blue");
    console.log(map9);
    map9.forEach((item,key)=>{
        // console.log(key,item);
        key.style.color = item;
    })




</script>